<template>
  <div>
    <div>
        count:{{count}}
        <button @click="count++">+</button>
    </div>
    
  </div>
</template>
<!-- 
  监听单个ref的步骤
  1、从vue包中导入watch函数
  2、使用watch来监听单个ref变量
  watch(ref变量,(newval,oldval)=>{})
  参数1：监听的ref变量
  参数2：监听的处理函数，该函数也有两个参数，第1个参数为更改后的值，第2个参数为更改之前的值
 -->
<script lang='ts' setup>
  import {ref,watch} from 'vue'
  const count=ref<number>(0)
  watch(count,(newval,oldval)=>{
    console.log('newval',newval,'oldval',oldval)  
  },{
    immediate:true
  })
</script>

<style lang='scss' scoped>
</style>